<template>
	<view class="typeBg">
		<!-- 头部 -->
		<view class="header_bar header_fixed header_main">
			<view class="header">
				<view class="header-goBack" @tap.stop="$tools.back(1)"></view>
				<view class="header-title">换货商品列表</view>
			</view> 
		</view> 
		
		<!-- 商品列表 -->
		<view class="goodsListBox">
			<!-- <goodsList :goodsDataList="goodsDataList"></goodsList> -->
			<view class="goodsBox">
				<view class="goodsList">
					<view class="goods-wrapper">
						<view class="initNoData" v-if="goodsDataList.length == 0"></view>
						<scroll-view scroll-y="true" v-else>
							<view class="goods-item" v-for="(item,index) in goodsDataList" :key="index" 
							@tap.stop="$tools.jump('/pages/goods/goodsDetails',item.id,productId)">
								<image class="goods-item__img" :src="item.image" mode="aspectFill"></image>
								<!-- <image class="goods-item__img" :src="'../../static/index/goods-'+(index+1)+'.png'" mode="aspectFill"></image> -->
								<view class="goods-item__title">
									{{ item.storeName }}
								</view>	
								<!-- <view class="goods-item__tipsBox">
									赠送：1000燃料值
								</view> -->
								<view class="goods-item__priceBox">
									<view class="goods-item__priceBox-price">{{ item.price }}</view>
									<view class="goods-item__priceBox-noPrice">¥{{ item.vipPrice }}</view>
								</view>
							</view>
						</scroll-view>
					</view>
				</view>
			</view>
		</view>
		
	</view> 
</template>

<script>
	import goodsList from '@/components/goodsList/goodsList.vue';
	export default {
		components:{
			goodsList
		},
		data(){
			return{
				pages: 1,
				pageIndex: 1,
				pageSize: 10,
				goodsDataList: [],
				isShowPage: false,
				productId: '',
			}
		},
		onLoad(options) {
			this.productId = options.value1;
		},
		onShow() {
			this.init();
		},
		onReachBottom() {
			console.log("ddd");
			if (this.pageIndex >= this.pages) {
				return this.$tools.toast('到底了');
			} else {
				this.pageIndex++;
				console.log("+++")
				this.getGoodsList();
			}
		},
		methods: {
			init(){
				this.isShowPage = false;
				this.pages = 1;
				this.pageIndex = 1;
				this.pageSize = 10;
				this.goodsDataList = [];
				this.getGoodsList();
			},
			// 查询商品推荐列表
			getGoodsList() {
				var data = {};
				data['productId'] = this.productId;
				uni.showLoading({
					mask:true
				})
				this.$Ajax('/api/refund/getExchangeGoods',data,res => {
						if (res.code == 200) {
							this.goodsDataList = res.data;
							this.isShowPage = true;
							uni.hideLoading();
						}
					}, err =>{
					}, 'GET'
				)
			},
		}
	}
</script>

<style lang="scss" scoped>
	page{
		background: #F5F5F5 !important;
	}
	.typeBg{
		width: 100%;
		background: #F5F5F5;
	}
	
	.goodsListBox{
		/* #ifdef H5 */
		padding-top: calc(90rpx);
		/* #endif */
		/* #ifdef APP-PLUS */
		padding-top: calc(160rpx);
		/* #endif */
	}
</style>